<template>
  <Form
    type="query"
    :dataObj="testData"
    :fieldSetting="fieldSetting"
    :formSetting="formSetting"
  ></Form>
</template>

<script lang="ts">
import { defineComponent, type PropType, ref, reactive } from 'vue'
import { type formField, fieldType } from '@/components/wt_antdv/type.d'
import Form from '@/components/wt_antdv/form'
interface UserInfo {
  name: string
  role: string
  age: number
  page: string
}
export default defineComponent({
  name: 'form_btn',
  components: {
    Form
  },
  setup(props, ctx) {
    const testData = reactive<UserInfo>({
      name: '',
      role: '',
      age: 0,
      page: ''
    })

    const formSetting = {
      labelCol: 130,
      wrapperCol: 130
    }
    const fieldSetting: Array<formField> = [
      {
        name: 'name',
        title: '姓名',
        type: fieldType.input
      },
      {
        name: 'role',
        title: '角色',
        type: fieldType.input
      },
      {
        name: 'age',
        title: '年领',
        type: fieldType.input
      },
      {
        name: 'page',
        title: '页面',
        type: fieldType.input
      }
    ]
    return {
      testData,
      formSetting,
      fieldSetting
    }
  }
})
</script>
